<!-- 分享按钮 -->
<template>
  <view class="d-flex align-items-center share-btn" @click="showShare = true">
    <image src="/static/images/home/iconWechat.png" alt="" class="block wechat" />
    <text>分享</text>
  </view>
  <van-share-sheet
    class="share-panel-round"
    v-model:show="showShare"
    title="立即分享给好友"
    :options="options"
    @select="onSelect"
  />
</template>

<script setup>
const showShare = ref(false)
const options = [
  { name: '微信', icon: 'wechat' },
  { name: '复制链接', icon: 'link' },
]

const onSelect = (option) => {
  showToast(option.name)
  showShare.value = false
}
</script>

<style>
.share-btn {
  padding: 6px 12px;
  background-color: rgba(255, 255, 255, 0.6);
  border-radius: 100px;
  .wechat {
    width: 16px;
    height: 16px;
    margin-right: 6px;
  }
}
</style>
